<!DOCTYPE html>
<html>
<meta charset="utf-8">
 <title>CMS文章表</title>
 <#include "/header.html">
<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight" id="rrapp">
		<div class="row">
			<div class="col-sm-12">
				<div class="ibox-content">
		   <form class="form-horizontal">
               <div class="form-group">
                   <div class="col-sm-2 control-label">文章标题</div>
                   <div class="col-sm-10">
                       <input type="text" class="form-control" v-model="cmsArticle.title" placeholder="文章标题"/>
                   </div>
               </div>
               <div class="form-group">
                   <div class="col-sm-2 control-label">文章分类编号</div>
                   <div class="col-sm-10">
                       <input type="text" class="form-control" v-model="cmsArticle.classId" placeholder="文章分类编号"/>
                   </div>
               </div>

               <div class="form-group">
                   <div class="col-sm-2 control-label" >展示图片</div>
                   <div class="layui-upload" style="width: 76%; float: right;">
                       <button type="button" class="layui-btn" id="test1">上传图片</button>
                       <div class="layui-upload-list">
                           <img class="layui-upload-img" id="demo1" style="width:300px;height:300px" :src=src>
                           <p id="demoText"></p>
                       </div>
                   </div>
               </div>

               <div class="form-group">
                   <div class="col-sm-2 control-label">文章排序0-255</div>
                   <div class="col-sm-10">
                       <input type="text" class="form-control" v-model="cmsArticle.sort" placeholder="文章排序0-255"/>
                   </div>
               </div>

               <div class="form-group">
                   <div class="col-sm-2 control-label">发布时间</div>
                   <div class="col-sm-10">
                       <input type="text" class="form-control" v-model="cmsArticle.publicTime" placeholder="发布时间"/>
                   </div>
               </div>

               <div class="form-group">
                   <div class="col-sm-2 control-label">文章正文</div>
                   <div class="col-sm-10">
                       <!--                             <input type="text" class="form-control" v-model="advertsDetail.content" placeholder="广告内容"/>
                        -->                         <div id="editor"     style="width: 710px;" v-model="cmsArticle.content" >

                   </div>
                   </div>
               </div>

               <div class="form-group">
                   <div class="col-sm-2 control-label"></div>
                   <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                   &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
               </div>
        </form>
			
			
	 
				</div>
				
			</div>
		</div>
		
	</div>

    <script src="${request.contextPath}/statics/plugins/layui/layui.js"></script>

    <script type="text/javascript" charset="utf-8" src="${request.contextPath}/statics/js/uedit/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${request.contextPath}/statics/js/uedit/ueditor.all.js"></script>
    <script type="text/javascript" charset="utf-8" src="${request.contextPath}/statics/js/uedit/lang/zh-cn/zh-cn.js"></script>
 	<script>

  function closeContent(){
 	 
 		var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
 	}  
  
    $(document)
	.ready(
			function() {
				vm.getInfo();	
			});  
  
 
 var vm = new Vue({
	el:'#rrapp',
	data:{
		showList: true,
		title: null,
        src:'',
		cmsArticle: {
		articleId:T.p("articleId"),
		}
	},
     created:function() {
         this.initComponent();
     },
	methods: {
		query: function () {
			vm.reload();
		} ,
		saveOrUpdate: function (event) {
			var url = vm.cmsArticle.articleId == null ? "article/cmsarticle/save" : "article/cmsarticle/update";
			$.ajax({
				type: "POST",
			    url: baseURL + url,
                contentType: "application/json",
			    data: JSON.stringify(vm.cmsArticle),
			    success: function(r){
			    	if(r.code === 0){
						alert('操作成功', function(index){
						parent.vm.reload();
				var index = parent.layer.getFrameIndex(window.name); // 获取窗口索引
				parent.layer.close(index);
						});
					}else{
						alert(r.msg);
					}
				}
			});
		} ,
		getInfo: function(){
		 if(!T.p("articleId")){
				 return;
			 }
			$.get(baseURL + "article/cmsarticle/info/"+T.p("articleId"), function(r){
                vm.cmsArticle = r.cmsArticle;
            });
		} ,
        initComponent:function () {
            //编辑器配置
            editor = UE.getEditor('editor',{
                serverUrl: 'http://127.0.0.1:8080/freeter-admin/ueditor/config',
                enableAutoSave:false,
                saveInterval:0,
                toolbars: [
                    [
                        'source', // 源代码
                        'bold', // 加粗
                        'italic', // 斜体
                        'underline', // 下划线
                        'strikethrough', // 删除线
                        'forecolor', // 字体颜色
                        'backcolor', // 背景色
                        'fontfamily', // 字体
                        'fontsize', // 字号
                        'paragraph', // 段落格式
                        'justifyleft', // 居左对齐
                        'justifycenter', // 居中对齐
                        'justifyright', // 居右对齐
                        'superscript', // 上标
                        'blockquote', // 引用
                        'selectall', // 全选
                        'preview', // 预览
                        'removeformat', // 清除格式
                        'inserttable', // 插入表格
                        'unlink', // 取消链接
                        'insertrow', // 前插入行
                        'insertcol', // 前插入列
                        'mergeright', // 右合并单元格
                        'mergedown', // 下合并单元格
                        'deleterow', // 删除行
                        'deletecol', // 删除列
                        'splittorows', // 拆分成行
                        'splittocols', // 拆分成列
                        'splittocells', // 完全拆分单元格
                        'deletecaption', // 删除表格标题
                        'inserttitle', // 插入标题
                        'mergecells', // 合并多个单元格
                        'deletetable', // 删除表格
                        'cleardoc', // 清空文档
                        'insertimage', // 多图上传
                        'link', // 超链接
                        'insertorderedlist', // 有序列表
                        'insertunorderedlist', // 无序列表
                        'fullscreen', // 全屏
                        'directionalityltr', // 从左向右输入
                        'directionalityrtl', // 从右向左输入
                        'imagenone', // 默认
                        'imageleft', // 左浮动
                        'imageright', // 右浮动
                        'imagecenter', // 居中
                        'lineheight', // 行间距
                        'customstyle', // 自定义标题
                    ]
                ],
            });

            editor.ready(function() {
                editor.setHeight(400);
            });

            Vue.nextTick(function () {
                layui.use('upload', function(){
                    var $ = layui.jquery
                        ,upload = layui.upload;

                    //普通图片上传
                    var uploadInst = upload.render({
                        elem: '#test1'
                        ,url: baseURL +'sys/oss/old/upload'
                        ,before: function(obj){
                            //预读本地文件示例，不支持ie8
                            console.log(JSON.stringify(obj),"before");
                            obj.preview(function(index, file, result){
                                $('#demo1').attr('src', result); //图片链接（base64）
                            });
                        }
                        ,done: function(res){
                            //如果上传失败
                            console.log(JSON.stringify(res),"done");
                            if(res.code > 0){
                                return layer.msg('上传失败');
                            }
                            vm.cmsArticle.image=res.data[0];
                            layer.msg('上传成功');
                            //上传成功
                        }
                        ,error: function(){
                            //演示失败状态，并实现重传
                            var demoText = $('#demoText');
                            demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                            demoText.find('.demo-reload').on('click', function(){
                                uploadInst.upload();
                            });
                        }
                    });
                });
            });
        }
	}
});
	</script>
	
	
</body>
</html>
